<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Alex Nolasco
http://www.mindovercode.com
Released for free under a Creative Commons Attribution 2.5 License
-->
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<title>Demo 2</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<link rel="stylesheet" href="reset.css" type="text/css"/>
	<link rel="stylesheet" href="theme.css" type="text/css"/>
</head>

<body>
    <div id="content">
    
      <div id="col1">
        <h3>Weather Demo</h3>
        <p><strong>M</strong>orem ipsum dolor sit amet, consectetur adipiscing elit. Cras lobortis aliquam est sed volutpat. Maecenas pulvinar nibh ipsum, ac mattis odio. Maecenas lorem dolor, condimentum id semper et, elementum sit amet tortor. Sed et commodo tortor. Duis convallis quam eget nulla fringilla quis dictum augue fringilla. Suspendisse potenti. Nulla ut hendrerit odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur hendrerit lectus eget magna vulputate tempus a id sapien. Aenean vel nulla est, ac congue nulla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ultricies tristique porta. Donec faucibus eleifend nibh, at condimentum justo fringilla nec. Nulla facilisi. Nulla sed magna eu odio dignissim commodo. Mauris molestie neque id ligula pharetra dignissim. Nunc cursus, erat nec interdum posuere, quam dui fringilla felis, nec pharetra erat risus eget enim. Sed quam quam, vestibulum pulvinar auctor vitae, iaculis vel eros.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras lobortis aliquam est sed volutpat. Maecenas pulvinar nibh ipsum, ac mattis odio. Maecenas lorem dolor, condimentum id semper et, elementum sit amet tortor. Sed et commodo tortor. Duis convallis quam eget nulla fringilla quis dictum augue fringilla. Suspendisse potenti. Nulla ut hendrerit odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur hendrerit lectus eget magna vulputate tempus a id sapien. Aenean vel nulla est, ac congue nulla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ultricies tristique porta. Donec faucibus eleifend nibh, at condimentum justo fringilla nec. Nulla facilisi. Nulla sed magna eu odio dignissim commodo. Mauris molestie neque id ligula pharetra dignissim. Nunc cursus, erat nec interdum posuere, quam dui fringilla felis, nec pharetra erat risus eget enim. Sed quam quam, vestibulum pulvinar auctor vitae, iaculis vel eros.</p>
        
        <div class="place">
          <img src="colorado.jpg" alt="colorado"/>
          <div id="colorado"></div>
           
        </div>
        <h5>Colorado</h5>
      </div>
      
      <div id="col2">      
      
        <div class="place">
          <img src="beach.jpg" alt="miami beach"/>         
          <div id="miamibeach"></div>
           
        </div>
        <h5>Miami Beach</h5>
        <p><strong>I</strong>psum dolor sit amet, consectetur adipiscing elit. Cras lobortis aliquam est sed volutpat. Maecenas pulvinar nibh ipsum, ac mattis odio. Maecenas lorem dolor, condimentum id semper et, elementum sit amet tortor. Sed et commodo tortor. Duis convallis quam eget nulla fringilla quis dictum augue fringilla. Suspendisse potenti. Nulla ut hendrerit odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur hendrerit lectus eget magna vulputate tempus a id sapien. Aenean vel nulla est, ac congue nulla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ultricies tristique porta. Donec faucibus eleifend nibh, at condimentum justo fringilla nec. Nulla facilisi. Nulla sed magna eu odio dignissim commodo. Mauris molestie neque id ligula pharetra dignissim. Nunc cursus, erat nec interdum posuere, quam dui fringilla felis, nec pharetra erat risus eget enim. Sed quam quam, vestibulum pulvinar auctor vitae, iaculis vel eros.</p>
        <p><strong>N</strong>psum dolor sit amet, consectetur adipiscing elit. Cras lobortis aliquam est sed volutpat. Maecenas pulvinar nibh ipsum, ac mattis odio. Maecenas lorem dolor, condimentum id semper et, elementum sit amet tortor. Sed et commodo tortor. Duis convallis quam eget nulla fringilla quis dictum augue fringilla. Suspendisse potenti. Nulla ut hendrerit odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur hendrerit lectus eget magna vulputate tempus a id sapien. Aenean vel nulla est, ac congue nulla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ultricies tristique porta. Donec faucibus eleifend nibh, at condimentum justo fringilla nec. Nulla facilisi. Nulla sed magna eu odio dignissim commodo. Mauris molestie neque id ligula pharetra dignissim. Nunc cursus, erat nec interdum posuere, quam dui fringilla felis, nec pharetra erat risus eget enim. Sed quam quam, vestibulum pulvinar auctor vitae, iaculis vel eros.</p>
      </div>

      <div style="clear:both"/>
              <p><strong>D</strong>psum dolor sit amet, consectetur adipiscing elit. Cras lobortis aliquam est sed volutpat. Maecenas pulvinar nibh ipsum, ac mattis odio. Maecenas lorem dolor, condimentum id semper et, elementum sit amet tortor. Sed et commodo tortor. Duis convallis quam eget nulla fringilla quis dictum augue fringilla. Suspendisse potenti. Nulla ut hendrerit odio. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur hendrerit lectus eget magna vulputate tempus a id sapien. Aenean vel nulla est, ac congue nulla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ultricies tristique porta. Donec faucibus eleifend nibh, at condimentum justo fringilla nec. Nulla facilisi. Nulla sed magna eu odio dignissim commodo. Mauris molestie neque id ligula pharetra dignissim. Nunc cursus, erat nec interdum posuere, quam dui fringilla felis, nec pharetra erat risus eget enim. Sed quam quam, vestibulum pulvinar auctor vitae, iaculis vel eros.</p>

    </div>
    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.jsonp-2.1.2.min.js"></script>
    <script type="text/javascript" src="jquery.template-1.0.js"></script>
    <script type="text/javascript" src="../../src/jquery.yawp-1.0.js"></script> 
    <script type="text/javascript">
      $(function(){
            $('#miamibeach').yaywp({
              locationCode: '33109',
              onError:function(e, el){
                if(typeof el !=='undefined'){ 
                  el.html(e);
                }
              }
            });
            $('#colorado').yaywp({
              locationCode: '81435',             
              onError:function(e,el){
                if(typeof el !=='undefined'){ 
                  el.html(e);
                }
              }
            });
      });
    </script>    
</body>
</html>